<template>
	<view class="bg-light">
		<tabsTop tabName="收获地址"></tabsTop>
		<scroll-view @scrolltolower="onReachScollBottom" scroll-y="true" class="w-100" :style="'height:calc(100vh - 240rpx) '">
			<!-- 地址列表 -->
			<view v-for="(item,index) in tableData" :key="index" class="mx-2 py-2">
				<view class="bg-white py-2 flex align-center rounded-lg">
					<view class="ml-2 w-100 flex flex-column">
						<text class="font mb-2">{{item.Name}} {{item.Phone}}</text>
						<text class="font-sm">{{Address(item.Address,item.Address_Details)}}</text>
					</view>
					<view @click.stop="handleEdit(item.Address_SerialNumber)" class="flex-shrink mr-2">
						<uni-icons v-if="item.Address_SerialNumber==customerAddress.Address_SerialNumber" type="star-filled" color="#ffc107" size="20"></uni-icons>
						<uni-icons fontFamily="iconfont" color="#828d96" size="20">{{'\ue8cf'}}</uni-icons>
					</view>
				</view>
			</view>
		</scroll-view>
		<!-- 底部新增地址 -->
		<view class="fixed-bottom shadow flex align-center justify-between bg-white" style="height: 110rpx;">
			<view @click="handlAdd" class="mx-3 w-100 bg-success px-3 py-2 rounded-circle flex justify-center">
				<text class="text-white font">新增地址</text>
			</view>
		</view>
	</view>
</template>

<script>
	const app = getApp();
	import tabsTop from "@/components/tabs/tabs-top.vue";
	import { getAddressAllAction } from "@/api/delivery.js";
	export default {
		components: {
			tabsTop, //顶部标题组件
		},
		data() {
			return {
				form:{//查询地址
					page:1,
					limit:10,
					Open_ID:app.globalData.Open_ID,
					App_ID:app.globalData.App_ID,
				},
				total:0,//总数
				isReach:true,//是否没到底
				tableData:[],//地址
				loading: false,//节流
				customerAddress:{}//默认地址
			}
		},
		onShow() {
			//查询默认地址
			this.customerAddress = uni.getStorageSync("customerAddress");
			this.form.page = 1;
			this.getData(this.form)

		},
		computed: {
			Address(){
				return function(str1,str2){
					try{
						return str1.replaceAll('/','') + str2;
					}catch(e){
						return "";
					}
				}
			}
		},
		methods: {
			async getData(data, onReach = false){
				if(!this.loading){
					this.loading = true;
					uni.showLoading({
						title: "加载中...",
					});
					const res = await getAddressAllAction(data);
					if(res.Status=='success'){
						//判断是否重新开始查询
						if(!onReach) {
							this.form.page = 1
							this.tableData = [];
						}
						this.tableData.push(...res.tableData);
						this.total = Number(res.limit);
					}
					uni.hideLoading();
					this.loading = false;
				}
			},
			onReachScollBottom(){//到底刷新数据
				if(this.isReach){//是否有剩余数据
					if (this.tableData.length < this.total) {
						this.form.page++;
						this.getData(this.form,true)
					} else {
						this.isReach = false;
					}
				}
			},
			handlAdd(){
				uni.navigateTo({
					url:'/pages/delivery/addressAdd'
				})
			},
			handleEdit(Address_SerialNumber){
				uni.navigateTo({
					url:'/pages/delivery/addressEdit?Address_SerialNumber='+Address_SerialNumber
				})
			}
		}
	}
</script>

<style>

</style>
